<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		#div01{
			width: 300px;
			height: 100px;
			background-color: #ADD8E6;
		}
	</style>
	<body>
		<div id="div01">
			
		</div>
		<script>
			div01.onmousedown=function(){
				console.log("鼠标按下了")
				div01.textContent="鼠标按下"
			}
			div01.onmouseup=function()
			{
				console.log("鼠标抬起了")
				div01.textContent="鼠标抬起"
			}
			div01.onmouseover=function()
			{
				console.log("鼠标移入了")
				div01.textContent="鼠标移入"
			}
			div01.onmouseout=function()
			{
				console.log("鼠标移出了")
				div01.textContent="鼠标移出"
			}
			div01.onmousemove =function()
			{
				div01.textContent="("+event.clientX+","+event.clientY+")";
			}
		</script>
	</body>
</html>
